<!--分享 商城-->
<template>
  <div class="bg">
    <div class="bg" v-if="param">
      <div class="title">
        <text class="font30 text1">{{T('Vtrading')}}</text>
        <div class="title-line"></div>
        <text class="font30 text1">{{T('策略商城')}}</text>
      </div>

      <div class="name">
        <text class="font48 text1 th67">{{param.strategyName}}</text>
        <div class="height10"></div>
        <text class="font26 lan th37">{{'['+param.strategyCode+']'}}</text>
      </div>

      <div class="rate">
        <div class="row aend">
          <text :class="['font108', Config.upDownFont(param.expectedAnnual)]">{{math.addJia(param.expectedAnnual)}}</text>
          <text :class="['font68', Config.upDownFont(param.expectedAnnual)]">{{'%'}}</text>
        </div>
        <div class="height10"></div>
        <text class="font24 lan th33">{{T('年化收益率')}}</text>
      </div>
  
      <div class="data">
        
        <div class="row acenter jbetween">

          <div class="column">
            <text class="data-title">{{T('策略介绍')}}</text>
            <div class="height10"></div>
            <text class="data-text">{{param.describe}}</text>
          </div>
          
          <div class="data-line"></div>

          <div class="column" v-if="param.free">
            <text class="data-title">{{T('限时免费')}}</text>
            <div class="height10"></div>
            <text class="data-money">{{T('原价')}}</text>
            <text class="data-money data-money-line">{{param.origPrice+'VTN/'+T('月')}}</text>
          </div>

          <div class="column" v-else>
            <text class="data-title">{{T('现价')}}</text>
            <div class="height10"></div>
            <text class="data-money">{{param.price+'VTN/'+T('月')}}</text>
            <div class="height20"></div>
            <text class="data-money data-money-line" v-if="Number(param.price) != Number(param.origPrice)">{{param.origPrice+'VTN/'+T('月')}}</text>
          </div>
        </div>
      </div>

      <div class="all"></div>
      <div class="info">
        <LImage class="logo" :src="Config.img('logo.png')"></LImage>
        <div class="column all">
          <text class="font24 text1">{{T('数字资产AI量化服务平台')}}</text>
          <text class="font22 text1">{{'Go with Vtrading to Victory'}}</text>
        </div>
        <div class="code-bg">
          <WeexQRCode v-if="inviteUrl" class="code main1" :code="inviteUrl"></WeexQRCode>
        </div>
      </div>
    </div>
  </div>
</template>

<script>

//功能
import modal from "@/_js/modal";
import math from "@/_js/math";
import Config from "@/_js/config";
import navigator from "@/_js/navigator";

const weexFunction = weex.requireModule("WeexFunction");

import I18N from "@/_i18n/i18n";
var T = I18N.t;
export default {
  data() {
    return {
      T:T,
      math:math,
      Config:Config,
      param:undefined,
      inviteUrl:'',
      keys:['strategyName', 'strategyCode', 'expectedAnnual', 'describe', 'price', 'origPrice', 'free'],
    };
  },

  mounted() {

    weexFunction.getConfig("onlySign",(value)=>{
      this.inviteUrl = value ? (Config.inviteUrl + value) : Config.inviteUrl;
    });

    Config.init(()=>{

      var param = navigator.getParam('param');
      for (let index = 0; index < this.keys.length; index++) {
        var key = this.keys[index];
        if (param[key] == null) {
          setTimeout(() => {
            modal.toast('缺失：'+key);
          }, 200);
          return true;
        }
      }
      this.param = param;
    },[Config.OPT_UP_DOWN]);
  },

  methods: {
  }
}

</script>


<style src="@/_css/style.css"></style>
<style scoped>
.bg {
  background-color: #131C61;
  width: 750px;
  min-height: 1220px;
}
.title{
  flex-direction: row;
  align-items: center;
  margin-top: 90px;
  margin-left: 60px;
}
.title-line{
  width: 1px;
  height: 35px;
  margin-right: 16px;
  margin-left: 16px;
  background-color:#8BAEF7;
}
.bg-image{
  position: absolute;
  width: 534px;
  height: 696px;

  top: 405px;
  right: 0px;
}

.name{
  flex-direction: column;
  align-items: center;
  width: 680px;
  margin-top: 155px;
  margin-left: 35px;
}

.rate{
  flex-direction: column;
  align-items: center;
  width: 680px;
  margin-left: 35px;
  margin-top: 90px;
}

/*介绍*/
.data{
  background-color: #11246C;
  width: 684px;

  border-radius: 20px;

  padding-left: 50px;
  padding-right: 50px;
  padding-top: 34px;
  padding-bottom: 34px;

  margin-top: 90px;
  margin-left: 33px;
}
.data-title{
  height: 42px;
  line-height: 42px;
  font-size: 30px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #0089F3;
}
.data-text{
  width: 345px;
  line-height: 40px;
  font-size: 24px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #8BAEF7;
}
.data-money{
  width: 129px;
  line-height: 33px;
  font-size: 24px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #8BAEF7;
}
.data-money-line{
  text-decoration:line-through;
}
.data-line{
  width: 1px;
  height: 120px;
  background-color:#192F7C;
}

/*信息*/
.info{
  flex-direction: row;
  align-items: center;
  background-color: #1A2B86;
  width: 750px;
  height: 150px;

  margin-top: 101px;
}
.logo{
  width: 72px;
  height: 72px;
  margin-left: 50px;
  margin-right: 20px;
}

.code-bg{
  justify-content: center;
  align-items: center;
  background-color: #fff;
  width: 110px;
  height: 110px;
  margin-right: 50px;
  margin-left: 20px;
}
.code{
  width: 105px;
  height: 105px;
}

/**** 高度*/
.height10{
  height: 10px;
}
.height20{
  height: 20px;
}
.height15{
  height: 15px;
}
.height26{
  height: 26px;
}

/****颜色*/
.lan{
  color:#0089F3;
}
</style>